<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title></title>
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<script src="__INDEX__/js/mui.min.js"></script>
	<link href="__INDEX__/css/mui.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="__INDEX__/css/iconfont.css" />
	<link rel="stylesheet" href="__INDEX__/css/style.css" />
	<link rel="stylesheet" href="__INDEX__/css/mall.css" />	
</head>
<body>
	<header class="mui-bar mui-bar-nav public-color">
		<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" href="JavaScript:history.go(-1)"></a>
		<h1 class="mui-title">订单评价</h1>
	</header>
	<div class="mui-content" style="background: white;">
		<form class="form-horizontal" method="post" id="form1" >
			<div class="ordpjbox">
				<div class="order_item">
					<div class="ordpj_lisitem">
						<a href="#">
							<div class="ordpj_img"><img src="/public/static/index/images/bac_mp.jpg"></div>
							<div class="ordpj_info">
								<p class="ordpj_nam">{$order.goods_name} </p>
								<p class="ordpj_pribox clearfix">
									<span class="ordpj_pri">￥{$order.pay_price}</span>
									<span class="ordpj_xnum">X1</span>
								</p>									
							</div>
						</a>
					</div>
					<div class="ordpj_nrbox" >
						<div class="ordpj_zpj">
							<label class="bt">消费评分：</label>
							<label><input type="radio" name="score" value="3" checked="checked">好评</label>
							<label><input type="radio" name="score" value="2">中评</label>
							<label><input type="radio" name="score" value="1">差评</label>
						</div>
						<div class="ordpj_textarea">
							<textarea class="form-control"  id="content" placeholder="写下购买体会和使用感受来帮助其他小伙伴~"></textarea>
						</div>	
						<div style="margin: 10px;" id="imglist">
						</div>
						<button id="test1" type="button" class="btn_tjtp"><i class="iconfont icon-tupian"></i>添加图片</button>
					</div>					
				</div>
			</div>
			<div class="ordpj_btnbox">
				<button type="button" onclick="commit();" name="submit" >提交</button>
			</div>
		</form>		
	</div>
</body>
</html>
{include file="public/footer" /}
<script>
	var arr=[];
	//图片上传
	layui.use(['form', 'upload'], function() {
		var $ = layui.jquery,
			upload = layui.upload,
			form = layui.form;

		//普通图片上传
		var uploadInst = upload.render({
			elem: '#test1',
			auto: false //选择文件后不自动上传
				,
			choose: function(obj) {
				if(arr.length>=5){
					layer.msg('最多上传5张图片');
					return;
				}
				//将每次选择的文件追加到文件队列
				var files = obj.pushFile();

				//预读本地文件，如果是多文件，则会遍历。(不支持ie8/9)
				obj.preview(function(index, file, result) {
					var sendData = result.substring(result.indexOf(";base64,") + 8);
					$.post("{:url('member/upload')}", {
						value: sendData
					}, function(data) {
						if(data.code == '200') {
							$("#imglist").append('<img class="layui-upload-img" style="height:78px;width:78px;border-radius: 3%;" src="'+data.url+'">');
							arr.push(data.url);
						} else {
							layer.msg(data.msg);
						}
					});
				});
			},
			url: "{:url('member/upload')}",
			accept: 'images'
		});
	})
	function commit(){
		var content=$("#content").val();
		if(content==""){
			layer.msg("请输入评价内容");
			return;
		}
	
		$.post("{:url('member/comment')}", {
			content: content,
			oid:'{$order.id}',
			score:$("input[type='radio']:checked").val(),
			goods_id:'{$order.goods_id}',
			agent_id:'{$order.agent_id}',
			imgs:arr
		}, function(data) {
			if(data.code == '200') {
				layer.msg(data.msg, {
					icon: 1,
					time: 1000
				}, function() {
					window.location.href = "{:url('member/orders')}";
				});
			} else {
				layer.msg(data.msg);
			}
		});
	}
</script>